<div class="order-container">
	<div class="order-wrapper">
		<h2 class="order-title">
			訂單<span>{{::data.orderDetail.orderNumber}}</span><span>({{data.orderDetail.orderStatus
				| orderState}})</span>
			<button class="btn btn-default"
				ng-if="data.orderDetail.orderStatus !== 'CANCELED' && data.orderDetail.orderStatus !== 'DONE'" ng-click="data.cancelState()">取消訂單</button>
			<button class="btn btn-primary" ng-if="data.orderDetail.orderStatus === 'CASHBACK'" ng-click="data.gotoNextState('TO_BE_REVIEWED')">確認返現</button>
		</h2>
		<div class="order-time">
			<div class="order-time-wrapper">
				開始于:<span>{{::data.orderDetail.orderTime}}</span>
			</div>
			<div class="order-time-wrapper">
				最近更新:<span>{{::data.orderDetail.lastUpdated}}</span>
			</div>
		</div>
		<div class="row">
			<label-plain-text class="col-md-4 order-line" label="酒店"
				model="data.orderDetail.hotel | empty"></label-plain-text>
			<label-plain-text class="col-md-4 order-line" label="宴會廳"
				model="data.orderDetail.banquetHall | empty"></label-plain-text>
			<label-plain-text class="col-md-4 order-line" label="桌數"
				model="data.orderDetail.tables | empty"></label-plain-text>
			<label-plain-text class="col-md-4 order-line" label="用戶"
				model="data.orderDetail.customer | empty"></label-plain-text>
			<label-plain-text class="col-md-4 order-line" label="聯係人"
				model="data.orderDetail.contact | empty"></label-plain-text>
			<label-plain-text class="col-md-4 order-line" label="聯係人電話"
				model="data.orderDetail.phone | empty"></label-plain-text>
			<label-plain-text class="col-md-4 order-line" label="推荐人"
				model="data.orderDetail.recommender | empty"></label-plain-text>
			<label-plain-text class="col-md-4 order-line" label="經理"
				model="data.orderDetail.manager | empty"></label-plain-text>
			<label-plain-text class="col-md-4 order-line" label="擺酒日期"
				model="data.orderDetail.feastingDate | empty"></label-plain-text>
		</div>
		<div class="candidate-container">
			<h3>預約日期</h3>
			<ul>
				<li ng-repeat="date in data.orderDetail.candidateDates">{{::date}}</li>
			</ul>
		</div>
		<div class="feastdata-container">
			<h3>辦酒日期</h3>
			<ul>
				<li>{{::data.orderDetail.feastingDate}}</li>
			</ul>
			<span ng-if="!data.orderDetail.feastingDate">暫無</span>
		</div>
		<div class="contract-line"
			ng-if="data.orderDetail.orderContractDTO && data.orderDetail.orderContractDTO.files && data.orderDetail.orderContractDTO.files.length">
			<h2>
				合同
			</h2>
			<zoom-images images="data.orderDetail.orderContractDTO.files"></zoom-images>
			<div class="row button-row"
				ng-if="data.orderDetail.orderContractDTO.approvalStatus === 'PENDING'">
				<button class="btn btn-primary"
					ng-click="data.approveContract('APPROVED')">通過</button>
				<button class="btn btn-primary"
					ng-click="data.approveContract('DECLINED')">拒絕</button>
			</div>
		</div>
		<div class="payment-line"
			ng-if="data.orderDetail.orderPaymentDTO && data.orderDetail.orderPaymentDTO.files && data.orderDetail.orderPaymentDTO.files.length">
			<h2>
				支付
			</h2>
			<div ng-if="data.orderDetail.orderPaymentDTO && data.orderDetail.orderPaymentDTO.amountPaid">需支付: <span>{{data.orderDetail.orderPaymentDTO.amountPaid | number:2}}</span></div>
			<zoom-images images="data.orderDetail.orderPaymentDTO.files"></zoom-images>
			<div class="row button-row"
				ng-if="data.orderDetail.orderPaymentDTO.approvalStatus === 'PENDING'">
				<button class="btn btn-primary"
					ng-click="data.approvePayment('APPROVED')">通過</button>
				<button class="btn btn-primary"
					ng-click="data.approvePayment('DECLINED')">拒絕</button>
			</div>
		</div>
		<div class="cashback-line">
			<h2>返現比例</h2>
			<div class="row" ng-if="data.orderDetail.orderStatus !== 'CANCELED' && data.orderDetail.orderStatus !== 'TO_BE_REVIEWED' && data.orderDetail.orderStatus !== 'DONE'">
				<label-input-text class="col-md-6"
					model="data.cashbackInfo.percentageForCustomer" label="用戶"></label-input-text>
				<label-input-text class="col-md-6"
					model="data.cashbackInfo.percentageForRecommender" label="推薦人"></label-input-text>
				<label-input-text class="col-md-6"
					model="data.cashbackInfo.percentageForManager" label="經理"></label-input-text>
			</div>
			<div class="row" ng-if="data.orderDetail.orderStatus === 'DONE' || data.orderDetail.orderStatus === 'TO_BE_REVIEWED'">
				<label-plain-text class="col-md-6"
					model="data.cashbackInfo.percentageForCustomer" label="用戶"></label-plain-text>
				<label-plain-text class="col-md-6"
					model="data.cashbackInfo.percentageForRecommender" label="推薦人"></label-plain-text>
				<label-plain-text class="col-md-6"
					model="data.cashbackInfo.percentageForManager" label="經理"></label-plain-text>
			</div>
			<div class="row save-button-line" ng-if="data.orderDetail.orderStatus !== 'CANCELED' && data.orderDetail.orderStatus !== 'TO_BE_REVIEWED' && data.orderDetail.orderStatus !== 'DONE'">
				<button class="btn btn-primary" ng-click="data.saveCashback()">保存返現比例</button>
			</div>
		</div>
	</div>
</div>